define('common:widget/ui/ai/imgListPreview/imgListPreview', function(require, exports, module) {

  /**
   * @file 预览图列表
   * @author yuanmin
   */
  
  var san = require('common:widget/ui/ai/san');
  
  return san.defineComponent({
      template: ''
          + '<div s-if="{{list.length > 0}}"'
          + '    class="img-list-wrapper"'
          + '    style="{{wrapperTransform}}"'
          + '>'
          + '    <div'
          + '        s-for="item, index in list"'
          + '        class="img-item-wrapper {{index === selectIndex && \'img-item-selected\'}}"'
          + '        on-click="handleItemClick(index)"'
          + '    >'
          + '        <div class="img-item">'
          + '            <img'
          + '                class="img-item"'
          + '                src="{{item.src}}"'
          + '            />'
          + '            <div s-if="index === 0" class="tag">原图</div>'
          + '        </div>'
          + '    </div>'
          + '</div>',
      computed: {
          wrapperTransform: function () {
              var width = this.data.get('width');
              var margin = this.data.get('margin');
              var bias = this.data.get('list').length / 2;
              var index = this.data.get('selectIndex') - bias;
              var transformDistance = -(width + margin) * index;
              return 'transform: translateX(' + transformDistance.toString() + 'px)';
          }
      },
      initData: function() {
          return {
              list: [],
              selectIndex: 1,
              width: 66,
              margin: 15,
          };
      },
      handleItemClick: function(index) {
          this.fire('item-click', {
              index,
              image: this.data.get('list')[index]
          });
      }
  });
  

});
